<template>
  <eip-modal
    :zIndex="1005"
    :visible="visible"
    :title="title"
    @close="cancel"
    width="600px"
  >
    <template slot="body">
      <a-spin :spinning="loading">
        <a-form-model
          ref="form"
          :model="form"
          :rules="rules"
          :label-col="config.labelCol"
          :wrapper-col="config.wrapperCol"
        >
          <a-row>
            <a-col>
              <a-form-model-item label="名称" prop="name">
                <a-input
                  v-model="form.name"
                  placeholder="请输入名称"
                  allow-clear
                />
              </a-form-model-item>
              <a-form-model-item label="禁用" prop="isFreeze">
                <a-switch
                  checked-children="运行中"
                  un-checked-children="已关闭"
                  :checked="!form.isFreeze"
                  @change="isFreezeChange"
                />
              </a-form-model-item>
              <a-form-model-item label="排序号" prop="orderNo">
                <a-input-number
                  id="inputNumber"
                  style="width: 100%"
                  placeholder="请输入排序号"
                  v-model="form.orderNo"
                  :min="0"
                  :max="999"
                />
              </a-form-model-item>
              <a-form-model-item label="备注" prop="remark">
                <a-input
                  allow-clear
                  v-model="form.remark"
                  type="textarea"
                  placeholder="请输入备注"
                />
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-spin>
    </template>
    <template slot="footer">
      <div class="flex justify-between align-center">
        <div></div>

        <a-space>
          <a-button @click="cancel"><a-icon type="close" />关闭</a-button>
          <a-button key="submit" @click="save" type="primary" :loading="loading"
            ><a-icon type="save" />提交</a-button
          >
        </a-space>
      </div>
    </template>
  </eip-modal>
</template>

<script>
import { save, findById } from "@/services/system/zerocode/automation/edit";
export default {
  name: "edit",
  data() {
    return {
      config: {
        labelCol: { span: 5 },
        wrapperCol: { span: 17 },
      },
      title: "",
      form: {
        zeroCodeAutomationId: null,
        name: null,
        remark: null,
        orderNo: 1,
        isFreeze: false,
      },

      rules: {
        name: [
          {
            required: true,
            message: "请输入名称",
            trigger: "blur",
          },
        ],
      },
      loading: false,
    };
  },

  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    automationId: String,
  },
  mounted() {
    this.find();
  },
  methods: {
    /**
     *
     */
    isFreezeChange() {
      this.form.isFreeze = !this.form.isFreeze;
    },
    /**
     * 取消
     */
    cancel() {
      this.$emit("update:visible", false);
    },

    /**
     * 保存
     */
    save() {
      let that = this;
      this.$refs.form.validate((valid) => {
        if (valid) {
          that.loading = true;
          that.$loading.show({ text: that.eipMsg.saveLoading });
          save(that.form).then(function (result) {
            if (result.code === that.eipResultCode.success) {
              that.$message.success(result.msg);
              that.cancel();
              that.$emit("ok", result);
            } else {
              that.$message.error(result.msg);
            }
            that.loading = false;
            that.$loading.hide();
          });
        }
      });
    },

    /**
     * 根据Id查找
     */
    async find() {
      let that = this;
      that.loading = true;
      findById(this.automationId).then(function (result) {
        that.form.zeroCodeAutomationId = result.data.zeroCodeAutomationId;
        that.form.name = result.data.name;
        that.form.remark = result.data.remark;
        that.form.orderNo = result.data.orderNo;
        that.form.isFreeze = result.data.isFreeze;
        that.title = that.form.name;
      });
      that.loading = false;
    },
  },
};
</script>
